import tinykeys from "tinykeys"
import { download, zoom, rotate, flip, transform } from './use-cropper'
import { show } from './use-image-form'

export interface Tool {
	action?: (event?: KeyboardEvent) => void
	description: string
	icon?: string
	keybinding?: string
	documented?: boolean
	primary?: string
}

export interface ToolbarGroup {
	name?: string
	actions: Tool[]
}

export const toolbar: ToolbarGroup[] = [
	{
		name: '旋转',
		actions: [
			{ keybinding: 'Alt+Shift+ArrowLeft', description: '逆时针旋转', icon: 'mdi:rotate-left', action: () => rotate(-90) },
			{ keybinding: 'Alt+Shift+ArrowRight', description: '顺时针旋转', icon: 'mdi:rotate-right', action: () => rotate(90) },
		],
	},
	{
		name: '翻转',
		actions: [
			{ keybinding: 'Alt+ArrowLeft', description: '水平翻转图像', icon: 'mdi:flip-horizontal', action: () => flip('horizontal') },
			{ keybinding: 'Alt+ArrowRight', description: '水平翻转图像', icon: 'mdi:flip-horizontal', action: () => flip('horizontal') },
			{ keybinding: 'Alt+ArrowUp', description: '垂直翻转图像', icon: 'mdi:flip-vertical', action: () => flip('vertical') },
			{ keybinding: 'Alt+ArrowDown', description: '垂直翻转图像', icon: 'mdi:flip-vertical', action: () => flip('vertical') },
		],
	},
	{
		name: '缩放',
		actions: [
			{ keybinding: 'Shift+Minus', description: '缩小图像', icon: 'mdi:magnify-minus-outline', action: () => zoom('out') },
			{ keybinding: 'Shift+Equal', description: '放大图像', icon: 'mdi:magnify-plus-outline', action: () => zoom('in') },
		],
	},
	{
		name: '位置',
		actions: [
			{ keybinding: 'Shift+m', description: '最大化裁剪区域', icon: 'mdi:arrow-expand-all', action: () => transform('maximize') },
			{ keybinding: 'Shift+c', description: '将裁剪区域居中', icon: 'mdi:image-filter-center-focus', action: () => transform('center') },
			{ keybinding: 'Shift+r', description: '重置为初始状态', icon: 'mdi:backup-restore', action: () => transform('reset') },
		],
	},
	{
		actions: [
			{ keybinding: 'Shift+o', description: '从文件夹选取图像', icon: 'mdi:folder-open-outline', primary: '', action: () => show() },
			{ keybinding: 'Ctrl+v', description: '从剪切板粘贴图像', documented: false },
			{ keybinding: 'Shift+s', description: '下载当前裁切区域图像', icon: 'uil:save', primary: '下载', action: () => download() },
		],
	},
]

export function useShortcuts() {
	const shortcuts = Object.fromEntries(toolbar
		.flatMap(({ actions }) => actions)
		.filter(({ documented, keybinding, action }) => documented !== false && keybinding && action)
		.map(({ keybinding, action }) => ([
			keybinding,
			(e: KeyboardEvent) => {
				e.preventDefault()
				e.stopPropagation()
				action?.(e)
			},
		])))
	console.log('shortcuts...',shortcuts);
	return tinykeys(window, {
		...shortcuts,
		'ArrowUp ArrowUp ArrowDown ArrowDown ArrowLeft ArrowRight ArrowLeft ArrowRight B A': () => document.location.href = 'https://www.youtube.com/watch?v=TBk_AepQBWQ',
	})
}
